<template>
    <div>
        <li v-for="p in list">{{ p.name }}--{{ p.age }}</li>
    </div>
</template>
<script setup lang="ts">
// 接收父组件传递参数
import { defineProps, onBeforeMount, onBeforeUpdate, onMounted, onUpdated ,onBeforeUnmount, onUnmounted} from 'vue';
defineProps(['list'])
// 生命周期钩子 父挂载之前--子挂载之前--子挂载完毕--父挂载完毕

// 创建阶段setup
console.log('创建');
// 生命周期钩子
onBeforeMount(()=>{
    console.log('挂载之前');
    
})


// 挂载完毕
onMounted(()=>{
    console.log('挂载完毕');
    
})
onUnmounted(()=>{
    console.log('卸载完毕');
    
})
onBeforeUpdate(()=>{
    console.log('更新之前');
    
})
onUpdated(()=>{
    console.log('更新完毕');
    
})
onBeforeUnmount(() => {
    console.log('卸载之前');
    
})

</script>
